<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>使用jQuery操作禁止按钮</title>
		<script src="js/jquery.min.js"></script>
	</head>
	<body>
		<!-- <button id="zfb" onclick=pay()>支付宝支付</button> -->
		<button id="zfb">支付宝支付</button>
		<!-- <button id="wx" onclick=pay()>微信支付</button> -->
		<button id="wx">微信支付</button>
	</body>
	<script>
		//直接在标签上写事件,前期绑定事件(写死,静态)
		//点击按钮来操作,禁止按钮,修改按钮名字
		// function pay(){
		// 	//禁止按钮,jQuery规范:对象prop属性值,支持true/false
		// 	$("#zfb").prop("disabled",true);
		// }
		
		//jQuery提供新的方式,后期绑定事件(动态),可以针对相应按钮写事件
		//后期绑定事件会把前期设置的事件覆盖掉,前期事件不生效
		$("#zfb").click(function(){
			//js代码 代表自身--this,jQuery中代表自身对象--$(this),不能直接写this,直接写this代表window对象
			$(this).prop("disabled",true);
			//修改文字
			$(this).text("正在支付,请稍后...")
		}); //参数是匿名函数
		$("#wx").click(function(){
			//链式编程
			$(this).prop("disabled",true).text("正在支付,请稍后...");
		})
	</script>
</html>
